<template>
	<view v-if="isShow">
		<!--页面遮罩层 -->
		<view class="modal-mask" bindtap="hideModal" @tap="isShow=false"></view>
		<!--页面提示弹窗 -->
		<view class="modal-dialog">
			<view class="t-title">您拒绝了地理位置授权,需要重新设置</view>


			<button class="showF" open-type="openSetting" @opensetting="handler">去设置</button>

		</view>
	</view>
</template>

<script>
	export default {
		name: "hyb-location-alert",
		data() {
			return {
				isShow: false
			};
		},
		methods: {
			show() {
				this.isShow = true;
			},
			handler: function(e) {
				console.log(e)
				this.isShow = false;
				if (e.detail.authSetting["scope.userLocation"]) {
					this.$emit("success")
				}
			},
		}
	}
</script>

<style>
	/* 遮罩层*/
	.modal-mask {
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		left: 0;
		background: #000;
		opacity: 0.5;
		z-index: 1170;
	}

	/* 页面提示弹窗*/
	.modal-dialog {
		overflow: hidden;
		position: fixed;
		top: 40%;
		background: #f9f9f9;
		border-radius: 30rpx;
		right: 5%;
		width: 90%;
		z-index: 1173;
		color: #000;
	}

	.view-image {
		width: 580rpx;
		height: 580rpx;
		margin-left: 50rpx;
	}

	.guanbi {
		position: absolute;
		width: 40rpx;
		height: 40rpx;
		background-size: 100%;
		text-align: center;
		top: 10px;
		right: 10px;
		font-size: 14px;
		line-height: 50rpx;
	}

	.t-title {
		font-size: 30rpx;
		text-align: center;
		margin: 30rpx 0;
		font-weight: bold;
	}

	.b-title {
		font-size: 26rpx;
		text-align: center;
		margin-top: 20rpx;
	}
</style>